import React from 'react';
import { Modal, Table } from 'antd';

interface Props {
  /**
   * 用户组 ID
   */
  goods_skus: any;
  /**
   * 是否显示
   */
  visible: boolean;
  onCancel: () => void;
}

export default function AttrModal(props: Props) {
  const { goods_skus = [], onCancel } = props;

  const dataSource = goods_skus.map((it: any, key: number) => ({
    ...it,
    key,
  }));

  const columns = [
    {
      title: '组合名称',
      dataIndex: 'composeNames',
      key: 'composeNames',
    },
    {
      title: '价格',
      dataIndex: 'price',
      key: 'price',
    },
    {
      title: '库存',
      dataIndex: 'stock',
      key: 'stock',
    },
  ];

  return (
    <Modal
      title="商品规格"
      visible
      onCancel={() => onCancel()}
      footer={null}
      okButtonProps={{}}
      okText="确定"
    >
      <Table dataSource={dataSource} columns={columns} />;
    </Modal>
  );
}
